import React, { ReactNode, MouseEvent } from 'react';

interface ButtonProps {
  type: 'button' | 'submit' | 'reset' | 'link' | 'div';
  children: ReactNode;
  className?: string;
  href?: string;
  onClick?: (event: MouseEvent<HTMLButtonElement | HTMLAnchorElement>) => void;
}

const defaultClasses =
  'flex w-fit gap-x-2 items-center border border-solid border-[#C5C5C5] shadow-[0_4px_10px_rgba(0,0,0,0.08)] hover:shadow-[0_4px_10px_rgba(3,11,166,0.18)] rounded-full text-[#030BA6] font-medium hover:bg-white hover:border-[#030BA6] py-2 px-8';

const Button: React.FC<ButtonProps> = ({ type, children, className, href, onClick }) => {
    const commonProps = {
        className: `${defaultClasses} ${className}`,
        onClick,
    };
    const divProps = {
        className: `${defaultClasses} ${className}`,
    };


    if (type === 'link') {
        return <a href={href} {...commonProps}>{children}</a>;
    } else if (type == 'div') {
        return <div {...divProps}>{children}</div>;
    } else {
        return <button type={type} {...commonProps}>{children}</button>;
    }
};

export default Button;
